<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <link rel="icon" href="/pic/聊天类.png" type="image/png" sizes="32x32">

    <title>注册</title>
    <link rel="stylesheet" href="css/login.css">
    <link rel="stylesheet" href="css/common.css">

</head>
<body>
    <script src="js/vue.js"></script>
    <script src="js/jquery-3.5.1.min.js"></script>

    <!-- 导航栏 -->
     <div class="nav">
         <p>云书</p>
     </div>


     <!-- 背景 -->
     <div class="background-pic"></div>

     <!-- 主页面 -->
     <div class="main-container">
       
        <!-- 登录框 -->
        <div class="main"  >
             <h3>注册</h3>
             <div class="row" id="userName">
                 <span>用户名:</span>
                 <input type="text"   v-model="val">
             </div>
             <div class="row"  id="password">
                <span>密  码:</span>
                <input type="password"   v-model="val" >
            </div>
            <div class="row"  id="password2">
                <span>重复密码:</span>
                <input type="password"   v-model="val" >
            </div>
            <div class="row">
                <span>验证码:</span>
                <input type="text" name="inputCaptcha" id="inputCaptcha"  v-model="val">
                <img id="verificationCodeImg"   src="/admin/captcha"  style="cursor: pointer;" titl="看不清？换一张"; >
            </div>
            <div class="row" >
                  <button type="submit" id="submit" @click="register" >注册</button>
            </div>
        </div>
     </div>
     
     <script>
            $("#verificationCodeImg").click(function(){
             $(this).hide().attr('src', '/admin/captcha?dt=' + new Date().getTime()).fadeIn();
           });
           $("#checkCaptcha").click(function () {
            alert("验证码校验");
          });
        
          
     </script>
       <script src="js/register.js"></script>

</body>
</html>